<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:p="http://primefaces.org/ui"
      xmlns:fn="http://java.sun.com/jsp/jstl/functions"
      xmlns:c="http://java.sun.com/jsp/jstl/core">

	<ui:composition>
		<h:form>			
			<div style="margin-left: 10px;margin-right: 5px;">
				<div style="float: left;">
					<p:panel header="Lançamentos" style="width:370px;height:360px">
						<div style="height: 290px;">						
							<h:dataTable id="list-lancamento" value="#{dashboardController.lancamentos}" var="lancamento">
								<h:column>
									<b><h:outputText value="#{lancamento.ramo.nome}"/></b>
								</h:column>
								<h:column>
									-
								</h:column>
								<h:column>																					
									<h:outputText value="#{lancamento.id}" /><p:spacer width="2px" />-<p:spacer width="2px" /> 															
									<p:commandLink actionListener="#{dashboardController.detailedLancamento}" oncomplete="dialogLancamento.show()" update=":lancamento-panel">
										<h:outputText id="titulo-lancamento" value="#{fn:substring(lancamento.titulo, 0, 30)}" />
										<f:param name="idAnuncio" value="#{lancamento.id}" />
									</p:commandLink>
									<h:outputText value="..." rendered="#{fn:length(lancamento.titulo) > 30}" />									
									<p:tooltip for="titulo-lancamento" value="Clique para ver mais..." showEffect="fade" hideEffect="fade" />																											   
								</h:column>
							</h:dataTable>
							
						</div>
						<f:facet name="footer">
							<p:commandLink value="Mais..." action="#{lancamentoController.loadLancamentos}" ajax="false"/>
						</f:facet>						
					</p:panel>
				</div>			
					
				<div style="float: right;">
					<p:panel header="Destaque" style="width:370px;height:360px">
						<div style="height: 290px;">
							<h:dataTable id="list-destaque" value="#{dashboardController.destaques}" var="destaque">
								<h:column>
									<b><h:outputText value="#{destaque.ramo.nome}" /></b>
								</h:column>
								<h:column>
									-
								</h:column>								
								<h:column>
									<h:outputText value="#{destaque.id}" /><p:spacer width="2px" />-<p:spacer width="2px" />
									<p:commandLink actionListener="#{dashboardController.detailedDestaque}" oncomplete="dialogDestaque.show()" update=":destaque-panel">
										<h:outputText id="titulo-destaque" value="#{fn:substring(destaque.titulo, 0, 30)}" />
										<f:param name="idAnuncio" value="#{destaque.id}" />
									</p:commandLink>									
									<h:outputText value="..." rendered="#{fn:length(destaque.titulo) > 30}" />
									<p:tooltip for="titulo-destaque" value="Clique para ver mais..." showEffect="fade" hideEffect="fade" />	
								</h:column>
							</h:dataTable>
						</div>
					</p:panel>
				</div>
				<div style="clear: both;width: 990px;height: 30px;"></div>
				<div style="clear: both;float: left;">
					<p:panel header="Acessos" style="width:370px;height:360px">
						<div style="height: 290px;">
							<p:barChart id="acessos" value="#{dashboardController.estatisticas}" legendPosition="se"  
            						title="Estatísticas" orientation="horizontal" style="height:285px"/> 
						</div>
						<f:facet name="footer">
							<p:commandLink value="Mais..."/>
						</f:facet>
					</p:panel>
				</div>
				<div style="float: right;">
					<p:panel header="Mensagens" style="width:370px;height:360px">
						<div style="height: 290px;">
							<h:outputText value="Lorem ipsum dolor sit amet, consectetur adipiscing elit. 
							Fusce at nisl quis dolor euismod convallis id a tortor. Nullam condimentum diam sed eros 
							tincidunt quis eleifend metus laoreet. Nullam cursus, magna eget convallis auctor, sem justo 
							pretium dui, ut vulputate lectus metus at nisl. Phasellus a consectetur leo. Nulla sit amet 
							velit quis mi lobortis fermentum id malesuada nisl. Curabitur volutpat mi eu mauris blandit cursus. 
							Vestibulum neque risus, luctus iaculis vestibulum sit amet, congue dignissim mi. Nulla bibendum mauris 
							non mauris aliquam id facilisis metus posuere. Nunc eu risus tempor dui tincidunt mollis. 
							Vivamus ullamcorper venenatis neque in consectetur. Aliquam tortor tortor, tristique et euismod sit amet, 
							semper vel elit. Nam consequat fermentum lacus vitae fermentum. Maecenas sit amet orci ante. 
							Pellentesque pharetra tortor a nibh placerat dictum. Ut tempor viverra dui, ac molestie eros faucibus 
							vestibulum. Quisque ac leo nisi. Etiam turpis mauris, accumsan et facilisis nec, aliquam sed massa. " />
						</div>
						<f:facet name="footer">
							<p:commandLink value="Mais..."/>
						</f:facet>
					</p:panel>
				</div>
			</div>			
		</h:form>
		
	</ui:composition>
</html>